<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>Title</title>
</head>
<link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/iCheck/square/blue.css">
</head>

<body class="hold-transition skin-purple sidebar-mini">

<div class="wrapper">

    <%@include file="header.jsp"%>

    <%@include file="aside.jsp"%>

    <div class="content-wrapper">
        <section class="content-header">
            <h1>
                订单管理
                <small>订单列表</small>
            </h1>
            <ol class="breadcrumb">
                <li><a href="${pageContext.request.contextPath}/pages/manage/main.jsp"><i class="fa fa-dashboard"></i> 首页</a></li>
                <li><a href="#">订单管理</a></li>
                <li class="active">订单列表</li>
            </ol>
        </section>

        <section class="content">
            <div class="box box-primary">
                <div class="box-body">
                    <div class="table-box">
                        <table id="dataList" class="table table-bordered table-striped table-hover dataTable">
                            <thead>
                            <tr>
                                <th class="sorting">订单ID</th>
                                <th class="sorting">商品名称</th>
                                <th class="sorting">商品价格</th>
                                <th class="sorting">商品图片</th>
                                <th class="sorting">数量</th>
                                <th class="sorting">订单总价</th>
                                <th class="sorting">下单人</th>
                                <th class="sorting">电话</th>
                                <th class="sorting">地址</th>
                                <th class="sorting">订单状态</th>
                                <th class="sorting">操作</th>
                            </tr>
                            </thead>
                            <tbody>
                                <c:forEach items="${orders}" var="orders">
                                    <tr style="height: 40px;">
                                        <td>${orders.order_id}</td>
                                        <td>${orders.product.product_name}</td>
                                        <td>${orders.product.product_price}</td>
                                        <td><img src="/product/${orders.product.product_image}" style="width: 50px;height: 40px;"/></td>
                                        <td>${orders.num}</td>
                                        <td>${orders.price}</td>
                                        <td>${orders.realname}</td>
                                        <td>${orders.phone}</td>
                                        <td>${orders.address}</td>
                                       <c:if test="${orders.status==1}"><td>已退货</td></c:if>
                                        <c:if test="${orders.status==0}"><td>已付款</td></c:if>
                                        <c:if test="${orders.status==2}"><td>已发货</td></c:if>
                                        <c:if test="${orders.status==3}"><td>已确认收货</td></c:if>
                                        <td class="text-center">
                                            <button type="button" class="btn bg-olive btn-xs" onclick="javascript:if(confirm('确定要发货吗?')&& ${orders.status}==0 ) {location.href='${pageContext.request.contextPath}/order/transmit?order_id=${orders.order_id}'}else{alert('订单状态有误')}">发货</button>
                                        </td>
                                    </tr>
                                </c:forEach>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="box-footer">
                    <div class="pull-left">
                        <div class="form-group form-inline">
                            总共${pageInfo.pages}页，共${pageInfo.total}条数据。 每页
                            <select class="form-control" id="changePageSize" name="choose" onchange="changePageSize()">
                                <option>${pageInfo.pageSize}</option>
                                <c:forEach begin="1" end="10" var="pageSize">
                                    <option>${pageSize}</option>
                                </c:forEach>
                            </select> 条
                        </div>
                    </div>

                    <div class="box-tools pull-right">
                        <ul class="pagination">
                            <li>
                                <a href="${pageContext.request.contextPath}/order/findAllOrder?page=1&size=${pageInfo.pageSize}" aria-label="Previous" >首页</a>
                            </li>
                            <li><a href="${pageContext.request.contextPath}/order/findAllOrder?page=${pageInfo.pageNum-1}">上一页</a></li>
                            <c:forEach begin="1" end="${pageInfo.pages}" var="pageNum">
                                <li><a href="${pageContext.request.contextPath}/order/findAllOrder?page=${pageNum}&size=${pageInfo.pageSize}" >${pageNum}</a></li>
                            </c:forEach>

                            <li><a href="${pageContext.request.contextPath}/order/findAllOrder?page=${pageInfo.pageNum+1}&size=${pageInfo.pageSize}" >下一页</a></li>
                            <li>
                                <a href="${pageContext.request.contextPath}/order/findAllOrder?page=${pageInfo.pages}&size=${pageInfo.pageSize}"  aria-label="Next">尾页</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </section>
    </div>

    <script src="${pageContext.request.contextPath}/plugins/jQuery/jquery-2.2.3.min.js"></script>
    <script src="${pageContext.request.contextPath}/plugins/jQueryUI/jquery-ui.min.js"></script>
    <script src="${pageContext.request.contextPath}/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
    <script src="${pageContext.request.contextPath}/plugins/iCheck/icheck.min.js"></script>
    <script src="${pageContext.request.contextPath}/plugins/adminLTE/js/app.min.js"></script>
    <script src="${pageContext.request.contextPath}/plugins/select2/select2.full.min.js"></script>
    <script>

        function changePageSize(){
            var pagesize = $("#changePageSize").val();
            location.href="${pageContext.request.contextPath}/order/findAllOrder?page=1&size="+pagesize;
        }
        // 设置激活菜单
        function setSidebarActive(tagUri) {
            var liObj = $("#" + tagUri);
            if (liObj.length > 0) {
                liObj.parent().parent().addClass("active");
                liObj.addClass("active");
            }
        }


        $(document).ready(function() {

            // 激活导航位置
            setSidebarActive("order-manage");

            // 列表按钮
            $("#dataList td input[type='checkbox']").iCheck({
                checkboxClass: 'icheckbox_square-blue',
                increaseArea: '20%'
            });
        });
    </script>
</body>
</html>
